<template>
  <div>
    <!-- <MyAlert 
      type="warning" 
      message=""
    /> -->
    <BasicTable @register="registerTable" >
      <template #tableTitle>
        <a-button type="primary" @click="handleForm(false, {})" >
          <Icon icon="i-ant-design:plus-outlined" /> {{ t('新增') }}
        </a-button>
      </template>

      <!-- <template #firstColumn="{ record }">
        <span class="cursor-pointer" @click="expandCollapse(record)">
          {{ record.areaName }}
        </span>
      </template> -->
    </BasicTable>
    <EditApiForm @register="registerFormApi" @success="handleSuccess" />
    <EditMenuForm @register="registerEditMenuForm" @success="handleSuccess" />
    <Detail @register="registerFormDetail"/>
    <AddForm @register="registerAddForm" @success="handleSuccess" />
  </div>
</template>
<script lang="ts" name="RamPermissionPolicy" setup>
import { ref } from 'vue';
import { Auth } from '/@/enums/authEnum'
import { BasicTable, BasicColumn, useTable } from '/@/components/Table';
import { useDrawer } from '/@/components/Drawer';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useGlobSetting } from '/@/hooks/setting';
import { columns, searchFormSchema } from './data';
import * as permPolicyApi from '/@/api/iam/permPolicy';
import { useMessage } from '/@/hooks/web/useMessage';
import { useModal } from "/@/components/Modal"
import EditApiForm from './EditApiForm.vue';
import AddForm from './AddForm.vue';
import EditMenuForm from './EditMenuForm.vue';
import Detail from './Detail.vue';
import { Icon } from '/@/components/Icon';
import { NamespaceCodeEnum } from '/@/enums/iamEnum'

const { t } = useI18n('');
const { createMessage } = useMessage();
const glob = useGlobSetting();
const showPolicyType = ref(false)
const { isDisabledAuth } = usePermission()
const [registerAddForm, { openModal: openAddForm }] = useModal()
const [registerFormApi, { openDrawer: openFormApi }] = useDrawer();
const [registerEditMenuForm, { openDrawer: openEditMenuForm }] = useDrawer();
const [registerFormDetail, { openDrawer: openFormDetail }] = useDrawer()
const props = defineProps({
  namespaceCode: { type: String, default: NamespaceCodeEnum.APP_GOVERN_HUB },
})

const actionColumn: BasicColumn = {
  width: 130,
  title: '操作',
  dataIndex: 'action',
  fixed: 'right',
  slot: 'tableActions',
  actions:  (record: Recordable) => [
    {
      label: '删除',
      color: 'error',
      ifShow: record.canWrite,
      auth: Auth.deleteRamPermissionPolicy,
      popConfirm: {
        title: '是否确认删除',
        confirm: handleDelete.bind(null, record),
      },
    },
    {
      label: '编辑',
      // auth: Auth.updateRamPermissionPolicy,
      onClick: handleForm.bind(null, true, record),
    },
    {
      label: '详情',
      onClick: handleDetail.bind(null, record),
    },
  ],
  dropDownActions: (record: Recordable) => [
    
  ]
}

const [registerTable, { reload, expandAll, collapseAll, expandCollapse }] = useTable({
  title: '权限策略',
  api: async (params) => {
    params.namespaceCode = props.namespaceCode
    const data = await permPolicyApi.pagePermissionPolicy(params)
    showPolicyType.value = data.showPolicyType
    return data;
  },
  columns: columns,
  bordered: false,
  beforeFetch: (params) => {
    return params;
  },
  formConfig: {
    baseColProps: { lg: 6, md: 12 },
    labelWidth: 90,
    schemas: searchFormSchema,
    showResetButton: false,
  },
  showTableSetting: true,
  useSearchForm: true,
  pagination: true,
  canResize: true,
  rowKey: 'id',
  actionColumn,
})

const handleForm = (isUpdate, record) => {
  if (!isUpdate) {
    openAddForm(true, { showPolicyType: showPolicyType.value, apiNamespaceCode: props.namespaceCode })
  } else {
    if (record.resourceType == '2') {
      openEditMenuForm(true, { record, apiNamespaceCode: props.namespaceCode });
    } else {
      openFormApi(true, { record, apiNamespaceCode: props.namespaceCode });
    }
  }

  
}
const handleDelete = async (record) => await permPolicyApi.deletePermissionPolicy({ 
  id: record.id,
  apiNamespaceCode: props.namespaceCode
}, reload)
const handleDetail = (record) => openFormDetail(true, { record, apiNamespaceCode: props.namespaceCode })
const handleSuccess = () => reload()

</script>
